<template>
	<div class="backtop" v-show="topshow">
		<div class="top"  @click="backtop">
			回到顶部
		</div>
	</div>
</template>

<script>
export default {
  name: 'backtop',
  data () {
    return {
     	topshow:false
    }
  },
  created(){
  	console.log(this)
  	var that=this;
  	window.addEventListener("scroll",function(e){	
		var top=document.documentElement.scrollTop;
		if(top>=100){
			that.topshow=true
		}else{
			that.topshow=false
		}
	})
 
  },
  methods:{
  	backtop(){
  		document.body.scrollTop = 0;
  		document.documentElement.scrollTop =0;
  	}
  	
  }
}
</script>

<style>
	.backtop{
		position: fixed;
		right: 50px;
		top:80%;
		border: 1px solid red;
		font-size: 24px;
		width: 50px;
		height: 50px;
		background: #CCCCCC;
	}
</style>